<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>胖糖个人中心</title>
  <link rel="stylesheet" href="./css/reset.css">
  <link rel="stylesheet" href="./css/common.css">
  <link rel="stylesheet" href="./css/yxny.css">
  <link rel="stylesheet" href="./iconfont/iconfont.css">
</head>

<body>
  <header class="clearfix">
    <div class="logo fl">
      <img src="./images/n-logo.png" alt="logo">
    </div>
    <nav>
      <ul>
        <li>
          <p>首页</p>
          <p>home</p>
        </li>
        <li>
          <p>游戏</p>
          <p>game</p>
        </li>
        <li>
          <p>案例</p>
          <p>Case</p>
        </li>
        <li>
          <p>关于我们</p>
          <p>About us</p>
        </li>
      </ul>
    </nav>
    <div class="weibo">
      <i class="iconfont iconweibo"></i>
    </div>
  </header>
  <div class="content">
    <div class="intro">
      <div class="intro-up">
        <div class="ny-logo">
          <img src="./images/ny-logo.png" alt="名字">
        </div>
        <div class="yellow"></div>
        <div class="introduce">
          <p>宝石迷阵</p>
          <p>《宝石迷阵》与暴司时候发行的游的的戏《星际争霸》一样，是一款成功的即时战略游戏。
            游戏时战略游戏所要素：建设基地和指挥指挥战斗。游戏的操作方式也，秉承了星霸优点，
            并对星际争霸中一些繁琐的操作进行了简化。</p>
          <div>
            <button>收藏</button>
            <button>制作游戏</button>
            <button>购买</button>
          </div>
        </div>

      </div>
      <div class="intro-down">
        <img src="./images/ny-blue.png" alt="blue">
        <div class="phone">
          <ul>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
          </ul>
        </div>
        <div class="icon">
          <div class="icons">
            <div>
              <i class="iconfont iconshijian"></i>
            </div>
            <p>时间</p>
            <p>2014-07-09</p>
          </div>
          <div class="icons">
            <div>
              <i class="iconfont iconziyuan"></i>
            </div>
            <p>价格</p>
            <p>2333</p>
          </div>
          <div class="icons">
            <div>
              <i class="iconfont iconai65"></i>
            </div>
            <p>使用次数</p>
            <p>20</p>
          </div>
          <div class="icons">
            <div>
              <i class="iconfont iconwenjianjia"></i>
            </div>
            <p>大小</p>
            <p>1034KB</p>
          </div>
        </div>
      </div>
    </div>
    <div class="method">
      <div class="yellow"></div>
      <div class="wenzi">
        <p>使用方法</p>
        <p>use Methods</p>
      </div>
      <div class="met-big">
        <div class="met">
          <div class="pic">
            <img src="./images/ny-method1.png" alt="method1">
          </div>
          <p>step one</p>
          <p>选择一个游戏，换图</p>
        </div>
        <div class="turn-r">
          <i class="iconfont iconyoujiantou"></i>
        </div>
        <div class="met ts">
          <div class="pic2">
            <img src="./images/ny-method2.png" alt="method2">
          </div>
          <p>The second step</p>
          <p>选择一个游戏，换图</p>
        </div>
        <div class="turn-r">
          <i class="iconfont iconyoujiantou"></i>
        </div>
        <div class="met">
          <div class="pic3">
            <img src="./images/ny-method3.png" alt="method3">
          </div>
          <p>The third step</p>
          <p>选择一个游戏，换图</p>
        </div>
      </div>
    </div>
  </div>
  <footer>
    <div class="blue">
      Copyright © 2014 Pangtang. All Rights Reserved. 版权所有
    </div>
    <div class="ta">
      <img src="./images/foot-l.png" alt="ta ">
    </div>
    <div class="tang">
      <img src="./images/foot-r.png" alt="tang">
    </div>
  </footer>
</body>

</html>